<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>老侯代读</title>
    <meta name="description" content=""/>
    <meta name="keywords" content=""/>
    <link rel="stylesheet" href="/css/style.css">
    <script src="/js/jquery.min.js"></script>
    <script src="/js/bookfriend.js"></script>
</head>
<body class="hsbg">
<div class="container">
    <div class="search-sort clearfix">
        <div class="search-people">
            <input id="KeyWords" class="people-input" type="text" placeholder="请输入姓名">
            <label class="searPeople" for="searPeople"><img src="/images/search-y.png" alt=""></label>
            <input onclick=" search();" id="searPeople" value="{{$keyword}}" type="button">
        </div>
        <div id="sort" class="sort">
        <span>排序</span><img class="to-down" src="/images/todown.png" alt="">
        </div>
    </div>
    <div class="main">
        <div class="option-item-box mt0">
            <ul id="friendsList" class="option-item friends-list">
                @foreach($entMemberDRP as $data)
                    <li>
                        @if($data->FilePath1!='')
                            <img class="user-nav-icon friends-pho" src="{{$data->FilePath1}}"/>
                        @else
                            <img class="user-nav-icon friends-pho" src="/images/friend-pho.png"/>
                        @endif

                        <div class="friends-info-box">
                            <p class="friends-name">{{$data->YourName}}</p>
                            {{--<p class="friends-status">--}}
                            {{--<span>推荐人：</span>--}}
                            {{--<span>马化腾</span>--}}
                            {{--</p>--}}
                            <p class="lose-time">推荐时间：<span>{{$data->AddDate}}</span></p>

                        </div>
                    </li>
                @endforeach
            </ul>
        </div>
    </div>
</div>
<div class="mask" id="mask" style="">
    <div id="askPanel" class="ask-panel">
        <div class="ask-pannel-head">
            <p class="bank-list-tit">排序方式</p>
        </div>
        <div class="ask-pannel-body">
            <ul id="bankList" class="bank-list">
                <li id="sortByTime"><a href="/partner/bookfriend/1.html"> 按照时间排序</a></li>
                {{--<li id="sortByMoney"><a href="/partner/bookfriend/2.html">按照贡献收益排序</a></li>--}}
            </ul>
        </div>
        <div class="ask-pannel-footer">
            <p id="cancleBank" class="cancle-bank">取消</p>
        </div>
    </div>
</div>
<script src="/js/js.js"></script>
<script src="/js/mask.js"></script>
<script>
    $(function(){
        var shMask = new mask($("#sort"), $("#mask"), $("#cancleBank"), function(){
//            var self = this;
            /*            $("#bankList li").on("click", function(){
             //                self.close();
             })*/
        });

        $("#askPanel").on("click", shMask.stopPro);

        $("#bankList li").on("click", function(){

            switch (true){
                case $(this).attr("id") == "sortByTime":
                    sort($("#friendsList"), ".lose-time");
                    break;
                case $(this).attr("id") == "sortByMoney":
                    sort($("#friendsList"), ".get-money");
                    break;
                default:;
            }

            shMask.close();
        })


    })

    function sort(obj, keyword){
        var sortObj = obj.find("li");
        var _arr = [];

        for(var i = 0, len = sortObj.length; i < len; i++){
            _arr.push(sortObj[i]);
        }
        _arr.sort(function(n1, n2){
            var v1 = changeToNumb($(n1).find(keyword).text()),
                    v2 = changeToNumb($(n2).find(keyword).text());
            return v1 - v2;
        });
        for(var j = 0, leng = _arr.length; j < leng; j++){
            obj.append(_arr[j]);
        }
    }

    function changeToNumb(numb){
        var number = numb;
        var reg = /\d+/g;
        number = number.match(reg);
        number = number.join("");
        return parseInt(Number(number));
    }



</script>
</body>
</html>